<template>
	<view class="background" :style="{'--width':width,'--height':height}">
		<view class="top" :style="{'--width':width,'--height':height}">
			<uni-icons type="back" size="30" class="back" @click="back"></uni-icons>
			<text class="text1">解锁</text>
		</view>
		<view class="card u-p-l-30 u-p-r-30 u-p-t-35 u-p-b-30" v-for="(item,index) in list" :key="item.id">
			<view class="u-font-28 color333">{{item.name}}</view>
			<view class="u-font-24 colorAA u-m-t-10 lh1-5">{{item.description}}</view>
			<view class="flex align-center u-m-t-30 justify-between">
				<view class="u-font-28 color333">
					<text class="u-font-40 bold u-m-r-10 text-warning">{{item.price}}</text>
					元/{{item.id == '32' ? '条' : item.id == '33' ? '份' : '年'}}
				</view>
				<view class="flex align-center">
					<view v-if="item.id == 33" class="preview" @click="preview">调剂报告预览</view>
					<view @click="handlePay(item.id)" class="btns">
						下单
					</view>
				</view>
			</view>
		</view>
		
		<view class="flex align-center u-font-28 color333 u-m-t-50 justify-around">
			<view class="text-center flex flex-column align-center justify-center">
				<image class="u-m-b-30 serveImg" :src="src1" show-menu-by-longpress	></image>
				<text>遇到问题请联系客服</text>
			</view>
			<view v-if="src2" class="text-center flex flex-column align-center justify-center">
				<image class="u-m-b-30 serveImg" :src="src2" show-menu-by-longpress	></image>
				<text>享受激活码优惠添加</text>
			</view>
		</view>
		
<!-- 		<text class="text2">遇到问题请联系客服</text>
		<image :src="src1" class="img"></image> -->


		<u-mask :show="tipsShow">
			<view class="flex align-center justify-center" style="height: 100%;">
				<view class="bg-white u-p-l-40 u-p-r-40 u-p-t-50 u-p-b-40 maskBox">
					<view class="title u-font-32 bold color333 text-center u-m-b-50">温馨提示</view>
					<view class="bold u-font-26 color333">下单前请确认好院校和分数</view>
					<view class="u-m-t-15 color999 u-font-24">一经确认后就不可以修改，因为对应不同的院校推荐信息；</view>
					<view class="bold u-font-26 color333 u-m-t-20">下单后，调剂报告可生成两份</view>
					<view class="u-m-t-15 color999 u-font-24">一份是初试分数调剂报告，一份是正式分数调剂报告；</view>
					<view class="bold u-font-26 color333 u-m-t-20">下单后，可在下载中心进行查看对应的订单</view>
					<view class="flex align-center justify-center u-m-t-80 btn u-font-24">
						<view class="edit" @click="back">修改信息</view>
						<view class="submit" @click="submit">确认下单</view>
					</view>
					<u-icon size="100" class="close"
						name="https://image.alhelp.net/uploads/20231104/ef86431325a6dc6f3a095a957d02cd3d.png"
						@click="tipsShow = false"></u-icon>
				</view>
			</view>
		</u-mask>

		<u-mask :show="buyShow">
			<view class="flex align-center justify-center" style="height: 100%;">
				<view class="bg-white u-p-l-40 u-p-r-40 u-p-t-50 u-p-b-40 maskBox">
					<view class="title u-font-32 bold color333 text-center u-m-b-50">支付成功</view>
					<view class="back-list" @click="back(33)">
						回到列表看信息
					</view>
					<view class="go-download" @click="downLoad">
						生成调剂报告
					</view>
				</view>
			</view>
		</u-mask>
	</view>
</template>

<script>
	import {
		shangpingliebiao,
		zhifu,
		jihuomama,
		kefu,
		serveUser
	} from "@/api/toolbox.js"
	export default {
		data() {
			return {
				buyShow: false,
				tipsShow: false,
				list: [],
				width: 0,
				height: 0,
				payOrderId: null,
				text: [
					["", ""],
					["", ""],
					["", ""]
				],
				paylist: {
					"goodsId": 30,
					"goodsType": "8",
					"payWay": "1",
					"payProduct": "1",
					"attach": {
						"schoolCode": "10001",
						"collegeCode": "006",
						"majorCode": "085400"
					}
				},
				school: "",
				college: "",
				major: "",
				studyType: "",
				src1: "../static/dianji.png",
				src2:"",
				tabIndex: 0,
				current: 0,
			}
		},
		onLoad(e) {
			let a = uni.getWindowInfo()
			this.width = a.screenWidth
			this.height = a.screenHeight
			if (e.obj && this.$u.test.jsonString(e.obj)) {
				let data = JSON.parse(e.obj);
				this.$set(this.paylist.attach, "schoolCode", data.value1)
				this.$set(this.paylist.attach, "collegeCode", data.value2)
				this.$set(this.paylist.attach, "majorCode", data.value3)
				this.school = data.school || '';
				this.college = data.college || '';
				this.major = data.major || '';
				this.studyType = data.studyType || '';
				this.tabIndex = data.tabIndex || 0;
				this.current = data.index;
				shangpingliebiao().then((res) => {
					if (res.code == 100000) {
						this.list = res.data;
					}
				})
				jihuomama().then((res) => {
					this.src2 = res.data
				})
				serveUser().then((res) => {
					this.src1 = res.data
				})

			}
			/*#ifdef APP-PLUS*/
			console.log('APP端')
			this.paylist.payProduct = "2"
			/*#endif*/
		},
		methods: {
			//确认下单
			submit() {
				this.but(33);
			},
			//跳转到下载调剂报告
			downLoad() {
				uni.setStorageSync('isEdit', true);
				uni.redirectTo({
					url: "xinxi?value=1&&payOrderId=" + this.payOrderId
				})
			},
			//调剂报告预览
			preview() {
				uni.showLoading({
					title: "加载中...",
					mask: true
				});
				//  #ifdef H5
				window.open(
					"https://aihelp.oss-cn-hangzhou.aliyuncs.com/public/base/2023/10/10/197646ff8fa14f2ebd305c1c4d7532d6.pdf"
				)
				// #endif
				// 微信下载文件需要在微信公众平台>开发>开发管理>服务器域名>downloadFile合法域名>配置白名单域名
				// #ifdef MP-WEIXIN
				uni.downloadFile({
					url: "https://aihelp.oss-cn-hangzhou.aliyuncs.com/public/base/2023/10/10/197646ff8fa14f2ebd305c1c4d7532d6.pdf",
					success: res => {
						if (res.statusCode === 200) {
							uni.hideLoading();
							// 预览pdf文件
							uni.openDocument({
								filePath: res.tempFilePath,
								showMenu: true, // 右上角菜单，可以进行分享保存pdf
								success: function(file) {
									console.log("file-success", file)
								}
							})
						}
					}
				})
				// #endif

				// #ifdef APP-PLUS
				uni.downloadFile({
					url: 'https://aihelp.oss-cn-hangzhou.aliyuncs.com/public/base/2023/10/10/197646ff8fa14f2ebd305c1c4d7532d6.pdf',
					success: function(res) {
						uni.hideLoading();
						var filePath = res.tempFilePath;
						uni.openDocument({
							filePath: filePath,
							showMenu: true,
							success: function(res) {
								console.log('打开文档成功');
							}
						});
					}
				});
				// #endif
			},
			handlePay(id) {
				if (id == 33) {
					this.tipsShow = true;
				} else {
					this.but(id);
				}
			},
			but(value) {
				let obj = JSON.parse(JSON.stringify(this.paylist));
				obj.goodsId = value
				if (value == 32) {
					obj.goodsType = "10"
					obj.attach['schoolName'] = this.school;
					obj.attach['collegeName'] = this.college;
					obj.attach['majorName'] = this.major;
					obj.attach['studyType'] = this.studyType;
				}
				if (value == 33) {
					obj.goodsType = "12"
					let storeObj = {
						chooseArr: JSON.parse(uni.getStorageSync('chooseArr')),
						fraction: JSON.parse(uni.getStorageSync('fraction')),
						information: JSON.parse(uni.getStorageSync('information'))
					}
					obj['otherData'] = JSON.stringify(storeObj)
					let schoolData = uni.getStorageSync('schoolData') ? JSON.parse(uni.getStorageSync('schoolData')) : null;
					if (schoolData) {
						obj.attach = {
							collegeCode: schoolData[2].value,
							majorCode: schoolData[3].value,
							schoolCode: schoolData[1].schoolCode
						}
					}
				}
				if (value == 31) {
					obj.goodsType = "11"
				}

				let firstTotal = 0;
				if (uni.getStorageSync('fraction')) {
					firstTotal = JSON.parse(uni.getStorageSync('fraction')).scroll1;
				}
				obj.attach['firstTotal'] = firstTotal;
				zhifu(obj).then((res) => {
					this.payOrderId = res.data.payOrderId;
					let b = res.data.wechatPayResponse
					uni.requestPayment({
						appid: b.appid,
						provider: 'wxpay',
						timeStamp: b.timeStamp,
						nonceStr: b.noncestr,
						package: b.packageStr,
						signType: 'RSA',
						paySign: b.sign,
						success: (res) => {
							if (value == 33) {
								this.tipsShow = false;
								this.buyShow = true;
							} else if (value == 32) {
								uni.setStorageSync('isEdit', true);
								let data = {
									college: this.college,
									collegeCode: this.paylist.attach.collegeCode,
									major: this.major,
									majorCode: this.paylist.attach.majorCode,
									schoolCode: this.paylist.attach.schoolCode,
									school: this.school,
									studyType: this.studyType == 1 ? '全日制' : '非全日制'
								}
								uni.redirectTo({
									url: '/pages/school/isomorphism/isomorphismDetail/isomorphismDetail?items=' + JSON
										.stringify(data),
								});
							} else {
								let pages = getCurrentPages();
								let prevPage = pages[pages.length - 2]; //上一页页面实例
								prevPage.$vm.flag = 1
								prevPage.onShow()
								if (this.tabIndex >= 3) {
									prevPage.$vm.$children[0].handleEditTf(this.current);
								} else {
									prevPage.$vm.$children[0].handleEditAdjust(this.current)
								}
								uni.navigateBack();
							}
						},
						fail: function(err) {
							console.log('fail:' + JSON.stringify(err));
						}
					});
				})
			},
			cha() {
				console.log(this.text)
			},
			back(value) {
				if (value && value == 33) {
					let pages = getCurrentPages();
					let prevPage = pages[pages.length - 2]; //上一页页面实例
					prevPage.$vm.flag = 1
					prevPage.onShow()
					if (this.tabIndex == 3) {
						prevPage.$vm.$children[0].handleEditTf(this.current);
					} else {
						prevPage.$vm.$children[0].sousuo(1)
					}
					uni.navigateBack();
				} else {
					uni.navigateBack();
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.maskBox {
		width: 70%;
		border-radius: 20rpx;
		position: relative;

		.close {
			position: absolute;
			left: 50%;
			bottom: -140rpx;
			transform: translate(-50%);
		}

		.back-list {
			background-color: #72819a;
			border-radius: 100rpx;
			padding: 20rpx 0;
			color: #fff;
			width: 400rpx;
			text-align: center;
			font-size: 24rpx;
			margin: 100rpx auto 0;
		}

		.go-download {
			border-radius: 100rpx;
			background-color: #FED534;
			color: #333;
			padding: 20rpx 0;
			width: 400rpx;
			text-align: center;
			font-size: 24rpx;
			margin: 40rpx auto 0;
		}


		.btn {
			.edit {
				border-radius: 100rpx 0 0 100rpx;
				background-color: #72819a;
				color: #fff;
				padding: 20rpx 60rpx;
			}

			.submit {
				border-radius: 0 100rpx 100rpx 0;
				background-color: #FED534;
				color: #333;
				padding: 20rpx 60rpx;
			}
		}

	}

	.background {
		background-color: #f0f0f0;
		width: calc(var(--width)*1px);
		height: calc(var(--height)/1000*940*1px);
	}

	.back {
		margin-left: calc(var(--width)/1000*10*1px);
	}

	.text1 {
		position: absolute;
		margin-left: calc(var(--width)/1000*30*1px);
		margin-top: calc(var(--height)/1000*3*1px);
		font-weight: bold;
	}

	.top {
		width: calc(var(--width)*1px);
		height: calc(var(--height)/1000*50*1px);
		background-color: white;
		margin-top: calc(var(--height)/1000*60*1px);
	}

	.card {
		width: calc(var(--width)/1000*900*1px);
		background-color: white;
		box-shadow: 7px 7px 5px #dadada;
		border-radius: 10px;
		margin-left: calc(var(--width)/1000*50*1px);
		margin-top: calc(var(--height)/1000*30*1px);
	}


	.text2 {
		position: absolute;
		font-size: 30rpx;
		font-weight: bold;
		margin-left: calc(var(--width)/1000*330*1px);
		margin-top: calc(var(--height)/1000*50*1px);
	}

	.img {
		width: calc(var(--width)/1000*400*1px);
		height: calc(var(--width)/1000*400*1px);
		margin-left: calc(var(--width)/1000*300*1px);
		margin-top: calc(var(--height)/1000*70*1px);
	}

	.text3 {
		position: absolute;
		margin-left: calc(var(--width)/1000*30*1px);

		margin-top: calc(var(--height)/1000*20*1px);
		font-size: 27rpx;


	}

	.text4 {
		position: absolute;
		margin-left: calc(var(--width)/1000*30*1px);

		margin-top: calc(var(--height)/1000*70*1px);
		font-size: 27rpx;
		font-weight: bold;
	}

	.jiage {
		color: #ffbb0e;
		font-size: 43rpx;
	}

	.but {
		position: absolute;
		font-size: calc(var(--width)/1000*32*1px);
		width: calc(var(--width)/1000*180*1px);
		height: calc(var(--height)/1000*40*1px);
		margin-top: calc(var(--height)/1000*50*1px);
		border-radius: calc(var(--height)/1000*50/2*1px);
		background-color: #FED534;
		color: #555555;
		margin-left: calc(var(--width)/1000*680*1px);

		.buttext {
			position: absolute;
			margin-top: calc(var(--height)/1000*7*1px);
			margin-left: calc(var(--width)/1000*55*1px);
		}
	}

	.btns {
		background-color: #FED534;
		font-size: 24rpx;
		color: #555555;
		padding: 16rpx 40rpx;
		border-radius: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.preview {
		margin-right: 12rpx;
		background-color: #000;
		font-size: 24rpx;
		color: #FED534;
		padding: 16rpx 40rpx;
		border-radius: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.serveImg{
		width: 160rpx;
		height: 160rpx;
	}
</style>